Description

Fixes two layout bugs on the admin dashboard pages:

1. Settings dropdown rendering behind page content
The dropdown (Dark Mode / Toggle Brightness) rendered behind the tab bar (Users/Payments/Activity Logs) instead of on top of it. Fixed by adding position: relative and zIndex: 1040 to the <Navbar> in NavBar.jsx, giving it its own stacking context so the dropdown (zIndex: 2000) reliably renders above page content.

2. Activity Logs filter panel overflowing its container
The filter row (Search/Role/Activity/From/To/Order/Rows) overflowed past the card's right edge due to a fixed 7-column grid in ActivityLogs.css that couldn't shrink below its minimum widths. Changed grid-template-columns to repeat(auto-fit, minmax(140px, 1fr)) so filter boxes wrap onto new rows instead of overflowing.

Closes #24

Before / After

Settings dropdown overlap (before → after):

Filter panel overflow (before → after):

Steps to Test

1. Log in as Admin (learn@learnhub.com / changethispassword)
2. Go to any admin tab (Users, Payments, or Activity Logs) and click Settings in the navbar
3. Confirm the dropdown renders cleanly above the tab bar, not behind it
4. Go to the Activity Logs tab
5. Confirm the filter row (Search/Role/Activity/From/To/Order/Rows) stays within the card's border and wraps onto a new row instead of overflowing

Build Verification

Ran npm run dev in frontend and it builds and runs with no new warnings or errors.

Type of Change

• 🐛 Bug fix (non-breaking change which fixes an issue)

Checklist

• My code follows the style guidelines of this project.
• I have performed a self-review of my own code.
• I have commented my code, particularly in hard-to-understand areas.
• I have made corresponding changes to the documentation.
• My changes generate no new warnings or console errors.
• I have tested my changes locally and verified they work as expected.
• Any dependent changes have been merged and published in downstream modules.